
$(function () {


    window.addEventListener("DOMContentLoaded", function () {
        //动态加载几个商品
        $.ajax({
            url: "/api/goods",
            type: "get",
            dataType: "json"
        }).then((res) => {
            let dataObj = JSON.parse(res.data)
            let proStr = ``
            dataObj.forEach((el, index) => {
                console.log(el.p_middleImg[0])
                proStr += `
       <div class="con${index + 1}">
           <a href="/carter.html?id=${el.p_id}" target="_blank">
               <img  data-original="${el.p_middleImg[0]}" alt="">
           </a>
       </div>
           `
            });
            proStr += `
        <div class="con4">
                    <img  data-original="./images/mainPro4.jpg" alt="">
        </div>
        `

            $(".midSizePro1").html(proStr)
        })

    })





    function lazyLoad() {
        //延迟加载
        $("#content").find("img").lazyload({
            placeholder: "./images/loading.gif", //用图片提前占位
            effect: "fadeIn", // 载入使用何种效果
            threshold: 00, // 提前开始加载
        });
    }

    $(window).on("load", function () {
        lazyLoad()

        //鼠标移入左边导航,背景颜色变化,
        $(".nav").on("mouseenter", "li", function () {
            if ($(this).index() != 0) {
                $(this).css("background", "url(./images/classNav2.jpg)")
                $(this).children("a").css("color", "#F8450B")
                $(".navContent").show()
                $(".navContent").children("li").eq($(this).index() - 1).show().siblings().hide()
            } else {
                $(".navContent").hide()
            }
        }).on("mouseleave", "li", function () {
            if ($(this).index() != 0) {
                $(this).css("background", "url(./images/classNav.jpg)")
                $(this).children("a").css("color", "#fff")
            }
        })
        $(".navBox").on("mouseleave", function () {
            $(".navContent").hide()
        })
        //鼠标进入所有分类的子项,改变颜色
        $(".all_infor").on("mouseenter", "a", function () {
            $(this).css("color", "#F8450B")
        }).on("mouseleave", "a", function () {
            $(this).css("color", "rgb(43, 43, 43)")
        })
        //轮播图(无缝轮播)
        var $newLi = $(".banner").find("li").eq(0).clone(true)
        $(".banner").children("ul").append($newLi)
        var $newLi2 = $(".banner").find("li").eq(4).clone(true)
        $(".banner").children("ul").prepend($newLi2)
        var tmpIndex = 2;
        var flag = true;
        function autoPlay() {
            tmpIndex++
            if (tmpIndex > 6) {
                tmpIndex = 2
                $(".banner").children("ul").css("left", "0")
            } else if (tmpIndex < 1) {
                tmpIndex = 5
                $(".banner").children("ul").css("left", -5 * $(".banner").find("li").width())
            }
            //大图轮播
            $(".banner").children("ul").animate({
                left: -$(".banner").find("li").width() * (tmpIndex - 1)
            }, function () {
                flag = true;
            })
        }
        window.timer = setInterval(autoPlay, 2000)
        //鼠标移入轮播区域,显示光标
        $(".banner").on("mouseenter", function () {
            $(".arrow").show()
            clearInterval(window.timer)
        }).on("mouseleave", function () {
            $(".arrow").hide()
            window.timer = setInterval(autoPlay, 2000)
        })
        //鼠标点击光标,往左边走,往右边走
        $(".leftArrow").on("click", function () {
            if (flag) {
                flag = false;
                tmpIndex -= 2
                autoPlay()
            }
        })
        $(".rightArrow").on("click", function () {
            if (flag) {
                flag = false;
                autoPlay()
            }
        })

        //进入APP显示二维码
        $(".line1").on("mouseenter", ".con", function () {
            $(this).css("color", "red")
            let appIndex = $(this).index()
            $(`.appQRcode`).eq(appIndex).show()
        }).on("mouseleave", ".con", function () {
            $(`.appQRcode`).hide()
            $(this).css("color", "#000")
        })
        //网站公告
        $('.webTile').on("click", ".webT", function () {
            $(this).addClass("current").siblings().removeClass("current")
            $(".webContent").eq($(this).index()).show().siblings().hide()
        })


        //多商秒杀
        //多商秒杀倒计时
        var serNum2 = $(".sec_time").find("a").eq(2).text();
        var serNum1 = $(".sec_time").find("a").eq(1).text();
        var serNum0 = $(".sec_time").find("a").eq(0).text();
        function secTime() {
            if (serNum2 < 0) {
                serNum2 = 60
                serNum1--
            } else if (serNum1 < 0) {
                serNum1 = 60
                serNum0--
            } else if (serNum0 == 0 && serNum1 == 0 && serNum2 == 0) {
                serNum2 = 0
                serNum1 = 0
                serNum0 = 0
                clearInterval(timer2)
                $(".end").text("活动结束")
            }
            $(".sec_time").find("a").eq(2).text(serNum2)
            $(".sec_time").find("a").eq(1).text(serNum1)
            $(".sec_time").find("a").eq(0).text(serNum0)
            serNum2--
        }
        var timer2 = setInterval(secTime, 1000)

        //多商秒杀轮播
        for (var i = 0; i < 3; i++) {
            var $newLB = $(".littleBa").children("li").eq(i).clone(true);
            $(".littleBa").append($newLB)
        }
        for (var i = 0; i < 3; i++) {
            var $newLB2 = $(".littleBa").children("li").eq(5).clone(true);
            $(".littleBa").prepend($newLB2)
        }

        var flag2 = true;
        var duoIndex = 3
        function autoPlay2() {
            duoIndex++
            if (duoIndex > 10) {
                duoIndex = 5
                $(".littleScr").children("ul").css("left", '-1200px')
            } else if (duoIndex < 0) {
                duoIndex = 7
                $(".littleScr").children("ul").css("left", '-2400px')
            }

            if (duoIndex <= 2) {
                $(".littleScr").children("ul").animate({
                    left: -($(".littleBa").find("li").width() + 10) * duoIndex
                }, function () {
                    flag2 = true;
                })
            } else {
                $(".littleScr").children("ul").animate({
                    left: -($(".littleBa").find("li").width() + 10) * (duoIndex - 1)
                }, function () {
                    flag2 = true;
                })
            }

        }
        var timer3 = setInterval(autoPlay2, 1500)
        //鼠标移入暂停,离开继续
        $(".littleScr").on("mouseenter", function () {
            clearInterval(timer3)
            // $(".arrow2").show()
        }).on("mouseleave", function () {
            timer3 = setInterval(autoPlay2, 1500)
            // $(".arrow2").hide()
        })
        $(".arrow2").on("click", "div", function () {
            if ($(this).index() == 0) {
                if (flag2) {
                    flag2 = false
                    duoIndex -= 2
                    autoPlay2()
                }
            } else {
                if (flag2) {
                    flag2 = false
                    autoPlay2()
                }

            }
        })

        //右边轮播
        var rightndex = 0
        function autoPlay3() {
            //上边的下标
            $(".rightTurn").find("li").eq(rightndex).addClass("on").siblings().removeClass("on");
            //下面的图
            $(".rightCon").eq(rightndex).animate({
                opacity: 1
            }).siblings().animate({
                opacity: 0
            })
            rightndex++
            if (rightndex >= 3) {
                rightndex = 0
            }
        }
        var timer4 = setInterval(autoPlay3, 2000)
        var rightndex2 = 0
        function autoPlay4() {
            //上边的下标
            $(".rightTit2").find("li").eq(rightndex2).addClass("on").siblings().removeClass("on");
            //下面的图
            $(".btmRight").children().eq(rightndex2).animate({
                opacity: 1
            }).siblings().animate({
                opacity: 0
            })
            rightndex2++
            if (rightndex2 >= 3) {
                rightndex2 = 0
            }
        }
        var timer5 = setInterval(autoPlay4, 2000)
        //进入鼠标暂停,离开继续轮播
        $(".rightTurn").on("mousemove", function () {
            clearInterval(timer4)
        }).on("mouseleave", function () {
            timer4 = setInterval(autoPlay3, 2000)
        })
        $(".rightTurn2").on("mousemove", function () {
            clearInterval(timer5)
        }).on("mouseleave", function () {
            timer5 = setInterval(autoPlay4, 2000)
        })
        //鼠标进入下标,显示页数
        $(".rightTit").find("li").on("mouseenter", function () {
            rightndex = $(this).index();
            autoPlay3()
        })
        $(".rightTit2").find("li").on("mouseenter", function () {
            rightndex2 = $(this).index();
            autoPlay4()
        })

        //多商动态轮播
        var duo2Index = 0
        function moveAuto() {
            if (duo2Index > 4) {
                duo2Index = 0
            } else if (duo2Index <= 0) {
                duo2Index = 0
            }
            $(".imgUl").stop().animate({
                left: - 380 * duo2Index
            })
            $(".round").find("li").eq(duo2Index).addClass("on").siblings().removeClass("on")
            console.log(111)
            duo2Index++
        }
        var timer6 = setInterval(moveAuto, 2000)

        //鼠标进入停止轮播
        $(".referSr").on("mousemove", function () {
            clearInterval(timer6)
        }).on("mouseleave", function () {
            timer6 = setInterval(moveAuto, 2000)
        })
        //点击箭头左右走
        $(".referArrow").on("click", "div", function () {
            if ($(this).index() == 0) {
                duo2Index -= 2
                moveAuto()
            } else {
                moveAuto()
            }
        })

    })


})